﻿<%@ Page Language="C#" AutoEventWireup="true" Inherits="dragGame" Codebehind="dragGame.aspx.cs" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script type="text/javascript" src="script/jQueryUI/jquery-ui-1.8.custom.min.js"></script>
<script type="text/javascript" src="script/games.js"></script>
<link href="style/StyleSheet.css" rel="stylesheet" type="text/css" />
<link href="style/jquery-ui-1.8.custom.css" rel="stylesheet" type="text/css" />
<title>Drag Game</title>
</head>
<body>
<form method="post" action="" id="parsafrase" style="text-align:left">
    <input type="text" id="frase" style="height:40px; line-height:35px; font-size:33px;" />
    <input type="submit" id="bottone" value="Vai" style="height:40px; line-height:35px; font-size:33px;"  />
</form>

<div id="area_gioco">
    <div style="position:relative; width:100%; background-color:Blue; font-size:35px; font-weight:bold; padding-top:25px; padding-bottom:25px;  color:White;">
    DragGame
    </div>
    <ul class="categories" style="position:relative;">
        <li class="ui-state-hover" id="1" style="left:10px; top:10px;">aggettivo</li>
        <li class="ui-state-hover" id="2" style="right:10px; top:170px;">avverbio</li>
        <li class="ui-state-hover" id="4" style="right:10px; top:10px;">determinativo</li>
        <li class="ui-state-hover" id="5" style="left:10px; top:170px;">preposizione</li>
        <li class="ui-state-hover" id="6" style="right:10px; top:330px;">interiezione</li>
        <li class="ui-state-hover" id="7" style="left:180px; top:10px;">numero</li>
        <li class="ui-state-hover" id="8" style="left:337px; top:10px;">pronome</li>
        <!--<li class="ui-state-hover" id="9">punteggiatura</li>-->
        <li class="ui-state-hover" id="10" style="right:180px; top:330px;">articolo</li>
        <li class="ui-state-hover" id="11" style="left:10px; top:330px;">nome</li>
        <li class="ui-state-hover" id="3" style="left:337px; top:330px">congiunzione</li>
        <li class="ui-state-hover" id="12" style="left:180px; top:330px">abbreviazione</li>
        <li class="ui-state-hover" id="13" style="right:180px; top:10px;">verbo</li>
        <!--<div class="ui-state-hover" id="14">classe residua</div>-->
    </ul>
<div id="spaceFrase">
<div id="space" style="width:350px; border:1px solid #000; margin:10px; margin-right:0px; height:193px; float:left;">

</div>
<div style="width:155px; border:1px solid #000; margin:10px; height:193px; float:left; background-color:Red;">

</div>

 </div>
<!--<div id="clicca" style="cursor:pointer; margin-top:10px; margin-left:10px; font-size:25px;">
    <strong>Stampa JSON</strong></div>-->
</div>
<p id="qui" style="font-size:25px;"></p>
</body>
</html>
